<div class="layui-form seller-form" action="">
	<div class="layui-form-item">
		<div class="layui-inline">
			<label class="layui-form-label">标题：</label>
			<div class="layui-input-inline seller-inline-4">
				<input type="text" name="title" lay-verify="title" placeholder="请输入标题" autocomplete="off"
					   class="layui-input">
			</div>
		</div>
		<div class="layui-inline">
			<label class="layui-form-label">导航：</label>
			<div class="layui-input-inline seller-inline-3">
				<select name="nav_id" lay-search>
					<option value="">选择导航</option>
					{volist name='navLists' id='vo'}
					<option value="{$vo.id}">{$vo.title}</option>
					{/volist}
				</select>
			</div>
		</div>
		<div class="layui-inline">
			<button class="layui-btn layui-btn-sm" lay-submit lay-filter="resource_search"><i
					class="iconfont icon-chaxun"></i>筛选
			</button>
			<button type="button" class="layui-btn layui-btn-sm add-resource"><i class="layui-icon">&#xe608;</i> 添加
			</button>
		</div>
	</div>
</div>
<div class="table-body">
	<table id="resourceTable" lay-filter="resourceTable"></table>
</div>
<script>
	layui.use(['table', 'form', 'layer', 'laydate'], function () {
		var layer = layui.layer, table = layui.table, form = layui.form, date = layui.laydate;
		//执行渲染
		table.render({
			elem: '#resourceTable', //指定原始表格元素选择器（推荐id选择器）
			height: 'full-139',
			cellMinWidth: '80',
			page: 'true',
			limit: '20',
			id: 'resourceTable',
			url: "{:url('resource/lists')}",
			cols: [[ //标题栏
				{field: 'id', width: 90, title: 'ID', align: 'center'},
				{field: 'title', title: '标题', align: 'center'},
				{
					field: 'pic', title: '图片', align: 'center', templet: function (data) {
						return '<a href="javascript:void(0);" onclick=viewImage("' + data.pic + '")><image style="max-width:30px;max-height:30px;" src="' + data.pic + '"/></a>';
					}
				},
				{field: 'brief', title: '简介', align: 'center'},
				{field: 'ctime', width: 170, title: '创建时间', align: 'center'},
				{field: 'nav', title: '导航', align: 'center'},
				{width: 240, title: '操作', align: 'center', toolbar: '#resourceBar'}
			]] //设置表头
			//,…… //更多参数参考右侧目录：基本参数选项
		});
		//搜索
		form.on('submit(resource_search)', function (data) {
			layui.table.reload('resourceTable', {
				where: data.field
				, page: {
					curr: 1 //重新从第 1 页开始
				}
			});
			return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
		});
		date.render({
			elem: '#utime',
			range: '到',
			trigger: 'click' //自动弹出控件的事件，采用click弹出
		});
		$(document).on('click', '.add-resource', function () {
			window.location.href = "{:url('resource/add')}";
		});
		//监听工具条
		table.on('tool(resourceTable)', function (obj) { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
			var data = obj.data; //获得当前行数据
			var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
			var tr = obj.tr; //获得当前行 tr 的DOM对象
			if (layEvent === 'del') { //删除
				layer.confirm('真的要删除么', {icon: 3}, function (index) {
					JsGet("{:url('resource/del')}?id=" + data.id, function (res) {
						if (res.status) {
							obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
							layer.close(index);//向服务端发送删除指令
						}
						layer.msg(res.msg);
					})
				});
			} else if (layEvent === 'edit') { //编辑
				var str = "{:url('resource/edit',array('id'=>'a_id'))}";
				editUrl = str.replace('a_id', data.id);
				window.location.href = editUrl;
			} else if (layEvent === 'recommend') { //为您推荐
				var str = "{:url('resource/recommend',array('id'=>'a_id'))}";
				recommendUrl = str.replace('a_id', data.id);
				window.location.href = recommendUrl;
			}
		});
	})
</script>
<script type="text/html" id="resourceBar">
	<a class="layui-btn layui-btn-xs" lay-event="recommend">为您推荐</a>
	<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
	<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
